<template>
	<view class="container">
		<view class="notice_item" v-if="list?.length">
			<view class="notice_title">系统消息</view>
			<view class="notice_content">消息通知消息通知，消息通知消息通知消息通知消息通知消息通知消息通知，消息通知消息通知消息通知消息通知消。</view>
			<view class="notice_date">2021/07/23 17:57:20</view>
		</view>
		<view class="notice_no_message">
			<image src="@/static/notice/no_message.png" />
		</view>
	</view>
</template>

<script setup>
	import {
		onShow
	} from "@dcloudio/uni-app"
	import {
		ref
	} from "vue";
	import {
		collectionList,
		collection
	} from "@/service"
	import {
		noticeList
	} from "@/service/home"

	import {
		BASE_OSS_URL
	} from "@/utils/request";
	
	const list = ref([])
	const getNoticeList = async () => {
		list.value = await noticeList()
	}
	onShow(() => {
		getNoticeList()
	})
</script>

<style lang="scss" scoped>
	.container {
		background: $body-bc;
		padding: 28rpx;
		min-height: 100vh;

		.notice_item {
			background: #112959;
			border-radius: 15rpx;
			padding: 30rpx 30rpx 26rpx;
			margin-bottom: 22rpx;

			.notice_title {
				font-family: Source Han Sans CN;
				font-weight: 500;
				font-size: 28rpx;
				color: $title-color;
			}

			.notice_content {
				padding: 26rpx 0 28rpx;
				border-bottom: 1rpx solid #1D4374;
				font-family: Source Han Sans CN;
				font-weight: 400;
				font-size: 22rpx;
				color: $content-color;
			}

			.notice_date {
				font-family: Source Han Sans CN;
				font-weight: 400;
				font-size: 22rpx;
				color: #3A75C0;
				margin-top: 24rpx;
			}
		}

		.notice_no_message {
			margin-top: 380rpx;
			display: flex;
			justify-content: center;

			image {
				width: 118rpx;
				height: 180rpx;
			}
		}
	}
</style>